/*
 * @Author: Otway
 * @Date: 2019-01-09 11:16:08
 * @LastEditors: Otway
 * @LastEditTime: 2019-08-30 18:50:09
 * @copyright: h-visions
 */
import React, { PureComponent } from 'react';
import {
    Row,
    Col,
    Form,
    Input,
    Select,
    Radio,
    DatePicker
} from 'antd';
const FormItem = Form.Item;
const { Option } = Select
const formItemLayout = {
    // 抽屉里面Form。二列的布局比例
    labelCol: {
        span: 6
    },
    wrapperCol: {
        span: 18
    }
};
class AddFrom extends PureComponent {
    state = {
        abnormal: null
    }
    selects = (data) => {
        this.setState({
            abnormal: data,
        })
    }
    render() {
        const {
            formData,
            one,
            form: { getFieldDecorator },
        } = this.props;
        const { abnormal } = this.state
        // console.log(one, this.state.abnormal);
        return (
            <Form >
                <Row>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'报告类别:'}>
                            {getFieldDecorator('code', {
                                initialValue: one ? formData.code : null,
                                rules: [
                                    {
                                        required: true,
                                        message: '请选择类别'
                                    }
                                ]
                            })(
                                <Radio.Group>
                                    <Radio value={'交机'}>
                                        交机
                                    </Radio>
                                    <Radio value={'出机'}>
                                        出机
                                    </Radio>
                                </Radio.Group>
                            )}
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'车间:'}>
                            {getFieldDecorator('name', {
                                initialValue: one ? formData.name : null,
                                rules: [
                                    {
                                        required: true,
                                        message: '请选择车间'
                                    }
                                ]
                            })(<Select allowClear={true} showSearch>
                                <Option value='试机' key={2}>试机</Option>
                                <Option value='自检' key={3}>自检</Option>
                                <Option value='质检' key={4}>质检</Option>
                            </Select>)}
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'装配开始时间:'}>
                            {getFieldDecorator('type', {
                                initialValue: one ? formData.type : null,
                                rules: [
                                    {
                                        required: true,
                                        message: '请选择装配开始时间'
                                    }
                                ]
                            })(
                                <DatePicker showTime />
                            )}
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'第一交机日期:'}>
                            {getFieldDecorator('object', {
                                initialValue: one ? formData.object : null,
                                rules: [
                                    {
                                        required: true,
                                        message: '请选择第一交机日期'
                                    }
                                ]
                            })(
                                <DatePicker />
                            )}
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'第一出机日期:'}>
                            {getFieldDecorator('remark', {
                                initialValue: one ? formData.remark : null,
                                rules: [
                                    {
                                        required: true,
                                        message: '请选择第一出机日期'
                                    }
                                ]
                            })(<DatePicker />)}
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'异常原因:'}>
                            {getFieldDecorator('isDelete1', {
                                initialValue: one ? formData.isDelete1 : null,
                                rules: [
                                    {
                                        required: true,
                                        message: '请输入异常原因'
                                    }
                                ]
                            })(
                                <Select placeholder='请选择' allowClear={true} showSearch onChange={(value) => this.selects(value)}>
                                    <Option value={1}>品质异常</Option>
                                    <Option value={2}>工程整改</Option>
                                    <Option value={3}>欠料</Option>
                                    <Option value={4}>产能不足</Option>
                                    <Option value={5}>其他</Option>
                                </Select>
                            )}
                        </FormItem>
                    </Col>
                    {
                        abnormal === 5 || (one ? formData.isDelete : null) === 5 ? <Col span={24}>
                            <FormItem {...formItemLayout} label={'异常内容:'}>
                                {getFieldDecorator('isDelete', {
                                    initialValue: one ? formData.isDelete : null,
                                    rules: [
                                        {
                                            required: true,
                                            message: '请输入异常内容'
                                        }
                                    ]
                                })(
                                    <Input placeholder='输入异常内容' allowClear maxLength={20} />
                                )}
                            </FormItem>
                        </Col> : null
                    }
                </Row>
            </Form>
        );
    }
}

export default Form.create()(AddFrom);
